<template>
  <div>
    <!-- <div v-if="allpending==1&&isStatus">
      <div v-if="auditstepslist.length>0" class="title">审批流程</div>
      <el-steps
        :active="step2"
        space="30%"
      >
        <el-step
          v-for="(item,index) in auditstepslist"
          :key="index"
          :title="!item.deptName ? item.userName:item.deptName"
          :icon=" 'el-icon-edit' "
          :description=" '这是审核'"
        >
          <template slot="title">
            <div>{{ !item.deptName ? item.userName:item.deptName }}</div>
          </template>
        </el-step>
      </el-steps>
    </div> -->
    <!-- <div class="title">记录</div> -->
    <div
      v-for="(info,index) in list"
      :key="index"
      style="
            margin-top: 20px;
            border-bottom: 1px dashed #dedede;
            padding-bottom: 20px;"
    >
      <el-descriptions :column="2">
        <el-descriptions-item v-if="typeText=='延期'" label-class-name="end-label" label="延期时间">{{ parseTime(info.extensionTime) }}</el-descriptions-item>
        <el-descriptions-item label-class-name="end-label" :label="`${typeText}说明`">{{ info.explain ?info.explain :'-' }}</el-descriptions-item>
        <el-descriptions-item label-class-name="end-label" :label="`${typeText}人`">{{ info.createBy?info.createBy :'-' }}</el-descriptions-item>
        <el-descriptions-item v-if="typeText!=='延期'" :span="2" label-class-name="end-label imageDes" :label="`${typeText}图片`">
          <el-image
            v-for="(item) in info.attachments"
            :key="item.id"
            class="attachment-image"
            :src="host + item.url"
            :preview-src-list="info.attachments.map(i=> host + i.url)"
          /></el-descriptions-item>
        <el-descriptions-item v-if="typeText=='延期'" :span="2" label-class-name="end-label displayinline" :label="`${typeText}附件`">
          <el-popover
            v-for="(item) in info.attachments"
            :key="item.id"
            :content="host+item.url"
            placement="top-start"
            title="路径"
            width="200"
            trigger="hover"
          >
            <a
              slot="reference"
              :href="host+item.url"
              class="el-link--primary"
              style="word-break:keep-all;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color: #1890ff;font-size: 13px;"
              target="_blank"
            >
              {{ host+ item.url }}
            </a>
          </el-popover>
        </el-descriptions-item>
      </el-descriptions>
      <br>
      <el-descriptions v-if="info.examine != null" :column="1">
        <el-descriptions-item label-class-name="end-label" label="复核人">{{ info.examine.createBy?info.examine.createBy :'-' }}</el-descriptions-item>
        <el-descriptions-item label-class-name="end-label" label="复核时间">{{ info.examine.createTime?parseTime(info.examine.createTime) :'-' }}</el-descriptions-item>
        <el-descriptions-item label-class-name="end-label" label="复核状态">{{ info.examine.isPassed==1?'通过' :'不通过' }}</el-descriptions-item>
        <el-descriptions-item v-if=" info.examine.isPassed!==1" label-class-name="end-label" label="复核原因">{{ info.examine.reason }}</el-descriptions-item>
      </el-descriptions>
      <br>
      <el-descriptions v-if="info.log != null" :column="1">
        <el-descriptions-item label-class-name="end-label" label="审核人">{{ info.log.createBy?info.log.createBy :'-' }}</el-descriptions-item>
        <el-descriptions-item label-class-name="end-label" label="审核时间">{{ info.log.createTime?parseTime(info.log.createTime) :'-' }}</el-descriptions-item>
        <el-descriptions-item label-class-name="end-label" label="审核状态">{{ info.log.isPassed==1?'通过' :'不通过' }}</el-descriptions-item>
        <el-descriptions-item v-if=" info.log.isPassed!==1" label-class-name="end-label" label="审核原因">{{ info.log.reason }}</el-descriptions-item>
      </el-descriptions>

    </div>
    <div v-if="allpending==1&&isStatus" style="text-align:center;text-align: center; margin-top: 20px;">
      <el-button @click="failClick('2')">{{ typeText }}不通过</el-button>
      <el-button type="primary" @click="toexamine('1')">{{ typeText }}通过</el-button>
    </div>
    <zdyDialog :visible.sync="visible" dialog-title="原因" @onSubmit="onSubmit">
      <el-form>
        <el-row>
          <el-col :span="24">
            <el-form-item label="不通过原因：" label-width="130px" prop="rejectionReason">
              <el-input v-model="rejectionReason" placeholder="请输入" clearable />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </zdyDialog>
  </div>
</template>

<script>
import { presenter } from '@crud/crud'
import { tHandleLog, selectTEvent } from '@/api/system/tEvent'
export default {
  data() {
    return {
      host: process.env.VUE_APP_BASE_API,
      info: { },
      visible: false,
      step2: 1,
      rejectionReason: '',
      attachments: [],
      aduitId: ''
    }
  },
  mixins: [presenter()],
  props: {
    isStatus: {
      type: Boolean,
      default: false
    },
    auditstepslist: {
      type: Array,
      default: [{ userName: '管理员' }]
    },
    list: {
      type: Array,
      default: []
    },
    typeText: {
      type: String,
      default: ''
    },
    id: {
      type: String,
      default: ''
    },
    allpending: {
      type: Number,
      default: 1
    },
    aduitType: {
      type: Number,
      default: 1
    }
  },
  watch: {
    // id:{
    //     deep:true,
    //     immediate:true,
    //     handler(val){
    //         let params ={id :val}
    //         this.attachments = []
    //         selectTEvent(params).then(res => {
    //           if(this.typeText=='处理'){
    //             this.attachments.splice(0,0,res.attachments.filter(i=>i.type==2))
    //             }
    //             if(this.typeText=='延期'){
    //             this.attachments.splice(0,0,res.attachments.filter(i=>i.type==3))
    //             }
    //             if(this.typeText=='争议'){
    //             this.attachments.splice(0,0,res.attachments.filter(i=>i.type==5))
    //             }
    //         })
    //     }
    // }
  },
  methods: {
    onSubmit() {
      if (this.rejectionReason != '') {
        // auditSubsidyReview({ applicationId: id, remark: this.rejectionReason, status: 2, subsidyType: 1 })
        this.visible = false
        this.toexamine('2')
      } else {
        this.$message.error('请输入不通过原因')
      }
    },
    failClick(state, id) {
      this.visible = true
    },
    // 通过审核 or 不通
    toexamine(state) {
      this.aduitId = this.list[this.list && this.list.length - 1].id
      const id = this.id
      let rejection = ''
      // 不通过需要添加不通过原因
      if (state == '2') {
        rejection = this.rejectionReason
      }
      // 审核结果 1=通过、2=未通过, subsidyType	补贴类型
      this.$confirm(`是否审核操作？`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        tHandleLog({ eventId: id, reason: rejection, isPassed: state == 1 ? 1 : 0, objectionId: this.aduitId, type: this.aduitType }).then(res => {
          // if (res.code == 200) {
          this.$message({
            type: 'success',
            message: `${state == 1 ? '审核通过成功' : '不通过审核成功'}`
          })
          this.$emit('back')
          // } else {
          //   this.$message.error('审核失败')
          // }
        }).catch(() => {
          this.$message.error('审核失败')
        })
      })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          })
        })
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .displayinline+.el-descriptions-item__content{
  display: grid;
}

::v-deep .imageDes+ .el-descriptions-item__content{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.title {
  font-size: 18px;
  color: #666666;
  font-weight: bold;
  margin: 30px 0 20px;
}
.attachment-image {
  width: 315px;
  height:215px;
  margin-left: 15px;
  margin-bottom: 15px;
}
  </style>
